<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport"
			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
	</head>
	<body>
		<!-- 标题-start -->
		<header class="mui-bar mui-bar-nav" style="display: flex;align-items: center;">
			<a style="color: #000000;" class=" mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">缴纳党费</h1>
			<label style="color: rgba(0,0,0,.5);margin-left: auto;font-size: 14px;" class="mui-pull-right">缴纳制度</label>
		</header>
		<!-- 标题-end -->
		<div class="mui-content">
			<div
				style="height: 200px;display: flex;flex-direction: column;align-items: center;justify-content: center;background-color: white;">
				<img id="imgzfzt" src="images/jiaodf/dengdaizhifu.png">
				<label id="zt">等待支付</label>
			</div>
			<div style="margin-top: 20px;background-color: white;">
				<ul class="mui-table-view">
					<li class="mui-table-view-cell" style="display: flex;justify-content: space-between;">
						<label style="color: rgba(0,0,0,.5);">姓名</label>
						<label>李小明</label>
					</li>
					<li class="mui-table-view-cell" style="display: flex;justify-content: space-between;">
						<label style="color: rgba(0,0,0,.5);">党员编号</label>
						<label>2084</label>
					</li>
					<li class="mui-table-view-cell" style="display: flex;justify-content: space-between;">
						<label style="color: rgba(0,0,0,.5);">所在支部</label>
						<label>大和村党支部</label>
					</li>
					<li class="mui-table-view-cell" style="display: flex;justify-content: space-between;">
						<label>待支付金额</label>
						<label style="color: red;">￥10.00元</label>
					</li>
				</ul>
			</div>
		</div>
		<div style="display: flex;justify-content:center;margin-top: 30px;">
			<button type="button" onclick="tiaozhuan2()"
				style="background-color: red;width: 80vw;height: 40px;border: none;line-height: 10px;"
				class="mui-btn mui-btn-blue mui-btn-block">立即支付</button>
		</div>
		<script src="js/mui.js"></script>
		<script type="text/javascript">
			mui.init()
			if (localStorage.getItem("test")) {
				document.querySelector("#zt").innerHTML = "已支付"
				document.querySelector("#imgzfzt").src = "images/sc/sccgimg.png"
				document.querySelector("#imgzfzt").style.width = "60px"
				document.querySelector("#imgzfzt").style.marginBottom = "10px"
				mui.alert('已经支付了', '提示', '确认', function(e) {
					e.index
					tiaozhuan("index.html")
				}, 'div')
			}
			function tiaozhuan2() {
				if (!localStorage.getItem("admin")) {
					mui.confirm('再登录后再进行操作', '登录', ['取消', '确认'], function(e) {
						console.log(e)
						if (e.index === 1) {

							tiaozhuan('login.html')
						} else {
							e.index
						}
					}, 'div')
					return
				}
				tiaozhuan('zhifu.html')
			}
		</script>
	</body>

</html>
